<template>
    <div class="swiper-container" :class="myclass"  :id="id" >
        <div class="swiper-wrapper">
            <slot></slot>
        </div>
    </div>
</template>

<script>
import Swiper from "swiper"
import "swiper/dist/css/swiper.min.css"
var mySwiper = null
export default {
    props:{
        id:String,
        myclass:String,
        swiperOptions:Object
    },
    data(){
        return {
            mySwiper:null
        }
    },
    methods:{
        slideToIndex(index){
            mySwiper.slideTo(index)
        }
    },
    mounted(){
         mySwiper = new Swiper("#"+this.id,{
            ...this.swiperOptions
        })
    }
}
</script>


<style>

</style>